<template>
  <div style="display: inline-block;text-align: left;">
    <el-button type="primary" size="mini" @click="openAdd">{{ $t('table.add') }}</el-button>
    <el-dialog v-if="dialogTableVisible" :visible.sync="dialogTableVisible" :title="$t('table.add')" width="50%">
      <el-form ref="formData" :model="formData" :rules="rules" label-position="right" label-width="auto">
        <el-form-item :label="$t('table.language_name')" prop="language">
          <el-input v-model="formData.language" label="right" type="text"/>
        </el-form-item>
        <el-form-item :label="$t('table.language_config')" prop="json">
          <el-input v-model="formData.json" label="right" type="textarea" autosize resize/>
        </el-form-item>
        <el-form-item align="right">
          <div>
            <el-button type="primary" size="small" @click="submitForm()">{{ $t('table.complete') }}</el-button>
            <el-button size="small" @click="closeDia()">{{ $t('table.cancel') }}</el-button>
          </div>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import axios from 'axios'
import store from '@/store'
import { addInfo } from '@/api/system/language'

export default {
  data() {
    return {
      dialogTableVisible: false,
      formData: {
        language: null,
        json: `
        {
    "el":{
        "colorpicker":{
            "confirm":"Save",
            "clear":"Clear"
        },
        "datepicker":{
            "now":"Now",
            "today":"Today",
            "cancel":"Cancel",
            "clear":"Clear",
            "confirm":"Save",
            "selectDate":"Select Date",
            "selectTime":"Select Time",
            "startDate":"Start Date",
            "startTime":"Start Time",
            "endDate":"End Date",
            "endTime":"End Time",
            "prevYear":"Previous Year",
            "nextYear":"Next Year",
            "prevMonth":"Previous Month",
            "nextMonth":"Next Month",
            "year":"Year",
            "month1":"January",
            "month2":"February",
            "month3":"March",
            "month4":"April",
            "month5":"May",
            "month6":"June",
            "month7":"July",
            "month8":"August",
            "month9":"September",
            "month10":"October",
            "month11":"November",
            "month12":"December",
            "weeks":{
                "sun":"Sun",
                "mon":"Mon",
                "tue":"Tues",
                "wed":"Wed",
                "thu":"Thur",
                "fri":"Fri",
                "sat":"Sat"
            },
            "months":{
                "jan":"Jan",
                "feb":"Feb",
                "mar":"Mar",
                "apr":"Apr",
                "may":"May",
                "jun":"Jun",
                "jul":"Jul",
                "aug":"Aug",
                "sep":"Sep",
                "oct":"Oct",
                "nov":"Nov",
                "dec":"Dec"
            }
        },
        "select":{
            "loading":"Loading",
            "noMatch":"No Matched Data",
            "noData":"No Data",
            "placeholder":"Please Select"
        },
        "cascader":{
            "noMatch":"No Matched Data",
            "loading":"Loading",
            "placeholder":"Please Select",
            "noData":"No Data"
        },
        "pagination":{
            "goto":"Go to",
            "pagesize":"pcs/page",
            "total":"total {total} pcs",
            "pageClassifier":"page"
        },
        "messagebox":{
            "title":"Tips",
            "confirm":"Save",
            "cancel":"Cancel",
            "error":"Incorrect Data!"
        },
        "upload":{
            "deleteTip":"Please press Delete Button to delete",
            "delete":"Delete",
            "preview":"Preview",
            "continue":"Continue"
        },
        "table":{
            "emptyText":"No Data",
            "confirmFilter":"Filter",
            "resetFilter":"Reset",
            "clearFilter":"All",
            "sumText":"Total"
        },
        "tree":{
            "emptyText":"No Data"
        },
        "transfer":{
            "noMatch":"No Matched Data",
            "noData":"No Data",
            "titles":[
                "List 1",
                "List 2"
            ],
            "filterPlaceholder":"Please enter what you want to search",
            "noCheckedFormat":"Total {total} pcs",
            "hasCheckedFormat":"Selected {checked}/{total} pcs"
        },
        "image":{
            "error":"Loading Failed"
        },
        "pageHeader":{
            "title":"Back"
        },
        "popconfirm":{
            "confirmButtonText":"Save",
            "cancelButtonText":"Cancel"
        }
    },
    "navbar":{
        "logOut":"Log out",
        "dashboard":"Home Page",
        "lang":"Language"
    },
    "login":{
        "title":"System Login",
        "logIn":"Login",
        "username":"User Name",
        "password":"Password",
        "remember_info":"Remember User Name&Password"
    },
    "table":{
        "title":"Title",
        "search":"Search",
        "add":"Add",
        "export":"Export",
        "operation":"Operation",
        "edit":"Edit",
        "delete":"Delete",
        "cancel":"Cancel",
        "complete":"Save",
        "confirm":"Save",
        "setting":"Setting",
        "tip":"Tips",
        "delete_msg":"Sure to Delete it？",
        "delete_complete":"Delete Successfully",
        "delete_fail":"Failed to Delete",
        "add_complete":"Add Successfully",
        "add_fail":"Failed to add",
        "edit_complete":"Edit Successfully",
        "edit_fail":"Failed to Edit",
        "setting_complete":"Save Successfully",
        "setting_fail":"Failed to save",
        "operated_complete":"Save successfuly",
        "operated_fail":"Failed to Save",
        "setting_tip":"Select Time Period",
        "serial_number":"ID",
        "avatar":"Face Photo",
        "company":"Company",
        "department":"Department",
        "worker_id":"User ID",
        "worker_name":"Name",
        "role":"Role",
        "start_date":"Start Date",
        "end_date":"End Date",
        "start_time":"Start Time",
        "end_time":"End Time",
        "access_control":"Access Control",
        "registration_time":"Registration Time",
        "remark":"Remark",
        "device_id":"Device ID",
        "device_name":"Device Name",
        "ip":"Server IP",
        "device_ip":"Device IP",
        "port":"Server Port",
        "switch":"Open-Door Switch",
        "push_device":"Push Settings to Device",
        "sync_person":"Upload User Data to Device",
        "connect_type":"Connect Type",
        "shift_name":"Shift Name",
        "roster":"Scheduled Employee",
        "holiday_name":"Holiday Name",
        "overtime_people":"Overtime Employee",
        "overtime_name":"Overtime Time Period",
        "overtime_period_name":"Name of Overtime Time Period",
        "temperature_setting":"Normal Body Temperature Setting",
        "normal_temperature_setting":"Normal Body Temperature Setting",
        "date":"Date",
        "time":"Time",
        "date_time":"Date&Time",
        "temperature":"Body Temperature",
        "temperature_status":"Status of Temperature",
        "temperature_hight":"High",
        "temperature_low":"Low",
        "normal":"Normal",
        "temperature_report":"Body Temperature Report",
        "batch_import":"Batch Import",
        "export_report":"Export Report",
        "attendance_report":"Worktime Report",
        "view_attendance_report":"View Worktime Report",
        "view_overtime_report":"View Overtime Report",
        "summary":"Summary",
        "view_attendance_summary_report":"View WorkTime Summary report",
        "view_summary":"View Worktime Summary Report",
        "view_overtimeLate":"View Late/Early-Leave Report",
        "worktime_period":"Work Time Period",
        "attendance_date":"Date",
        "check_time":"Check-In Time",
        "check_out_time":"Check-Out Time",
        "late":"Late",
        "leave_early":"Early-Leave",
        "beLateAndLeave":"Late & Early-Leave",
        "attendance_status":"Attendance Status",
        "total_attendance":"Work (Minutes)",
        "normal_work_days":"Work(day)",
        "work_time_total":"Total Work Time (Minutes)",
        "late_total":"Late Numbers",
        "late_time":"Late Time(Minutes)",
        "leave_early_total":"Early-Leave Numbers",
        "leave_early_time":"Early-Leave (Minutes)",
        "over_total":"Overtime Numbers",
        "over_time":"OverTime (Minutes)",
        "plan_overtime":"Planned Overtime (Minutes)",
        "real_overtime":"Actual Overtime",
        "language":"Language",
        "language_name":"Language Name",
        "language_config":"Language Setting",
        "template_download":"Download Template Form",
        "toOption":"Operate now",
        "one":"1st Step",
        "two":"2nd Step",
        "three":"3rd Step",
        "four":"4th Step",
        "five":"5th Step",
        "six":"6th Step",
        "guideTip1":"If Device and Server is in the same LAN, You can see all devices in Device Management, then you just need to enter server IP",
        "guideTip2":"Add Company and Department Info",
        "guideTip3":"Add Employee Info with name and face photo or batch import from EXCEL form；",
        "guideTip4":"Select Devices to Upload Employee Data",
        "guideTip5":"Attendance Shift Setting-Shift Setting-Shift Schedule",
        "guideTip6":"Select the company or department or specific employees in shift schedule.",
        "status":"Online Status",
        "online":"Online",
        "offline":"Offline",
        "Massdelete":"Batch Delete"
    },
    "menu":{
        "home":"Home Page",
        "authority":"Permission Management",
        "role":"Role Management",
        "manage":"Admin Management",
        "equipment":"Device Management",
        "LAN_device_scan":"Search in LAN",
        "open_door_remotely":"Open-Door Switch",
        "OTA_upgrade":"OTA Upgrade",
        "organization":"Organization Management",
        "staff":"Employee Management",
        "attendance_settings":"Attendance Management",
        "attendance_shift":"Attendance Shift",
        "holiday_setting":"Holiday Setting",
        "overtime_setting":"Overtime Setting",
        "overtime_period_setting":"Overtime Time Period Setting",
        "temperature":"Body Temperature Management",
        "statistical_report":"Summary Report",
        "attendance_report":"Worktime Report",
        "overtime_report":"Overtime Report",
        "access_records":"All Access Logs Report",
        "late_and_leave_early_report":"Late/Early-Leave Report ",
        "system_settings":"Multi-Language Setting",
        "quick_start":"Quick-Start",
        "instructions":"User Manual"
    },
    "home":{
        "today_attendance_statistics":"Today Attendance Summary",
        "should_attend":"Plan Attended Employee",
        "number_of_attendance":"Actual Attended Employee",
        "number_of_absentees":"Absent Employee",
        "today_temperature_statistics":"Today Summary of Body Temperature",
        "number_of_people_taking_temperature":"Measured Employee",
        "number_of_normal_body_temperature":"Normal Employee",
        "number_of_abnormal_body_temperature":"Abnormal Employee"
    },
    "authority":{
        "role_name":"Role Name",
        "role_mark":"Role Mark Name",
        "authority":"Permission",
        "all":"All",
        "add":"Add",
        "edit":"Edit",
        "username":"User Name",
        "nickname":"Short Name",
        "phone":"Phone Number",
        "status":"Status of Account",
        "on":"ON",
        "off":"OFF"
    },
    "equipment":{
        "scanning":"Search",
        "configure_in_batch":"Batch Push",
        "switch":"Open-Door",
        "push":"Push",
        "sync":"Upload",
        "OTA_upgrade":"OTA Upgrade",
        "upload_OTA":"Upload OTA Files",
        "device_id":"Device ID",
        "device_name":"Device Name",
        "open_door_continue_time":"Door-Opening Time",
        "camera_detect_type":"Live Detection",
        "face_feature_pair_number":"Threshold of Face Recognition",
        "device_defend_time":"Auto-Reboot Time",
        "open_door_type":"Verify Mode",
        "type_living":"Live",
        "type_no_living":"Non-Live",
        "fill_light_times":"Flash LED",
        "low_power_times":"Sleeping",
        "type_face":"Face",
        "type_temp":"Body Temperature",
        "type_temperature":"Face/Card+Temperature",
        "type_stranger":"Face/Card+Temperature(Measure Stranger also)",
        "device_ip_setting":"Device Setting",
        "server_ip":"Server IP",
        "subnet_ip":"Subnet mask",
        "gateway":"Gateway",
        "dns":"Primary DNS",
        "dns_alter":"Backup DNS",
        "port":"Server Port",
        "mask_flag":"Mask Detection",
        "on":"ON",
        "off":"OFF",
        "begin_reco_distance":"Face Recognition Distance (0.3M-4M)",
        "far":"Far",
        "near":"Near",
        "device_music_size":"Volume Adjustment",
        "normal_temp":"Normal Body Temperature Range",
        "low_temp":"Alarm Temperature",
        "unlock":"Unlock",
        "unlock_tip":"Enter password",
        "unlock_tip1":"unlocked successfully",
        "unlock_tip2":"unlocked failed",
        "openSever":"Enable Server",
        "openScan":"Search in LAN",
        "temperature_type":"℃ / ℉",
        "pushBatch":"Batch Push",
        "uploadBatch":"Batch Upload",
        "deletePersonBatchs":"Clear All User Data in Device",
        "deletePersonTip":"Delete Selected User in Device？",
        "add_tip":"(For Adding device with WAN IP Address)",
        "reboot":"Batch Reboot Device"
    },
    "organization":{
        "add_company":"Add Company",
        "add_department":"Add Department",
        "company_list":"Company List",
        "delete_department":"Delete Department",
        "edit_department":"Edit Department"
    },
    "staff":{
        "import_template_download":"Download Import Template",
        "batch_import":"Batch Import",
        "employee_card_id":"ID/IC Card No.",
        "img_enc":"Encryped Photo",
        "gender":"Gender",
        "is_departure":"Resign",
        "departure_time":"Resign Date",
        "staff_report":"Employee List Report",
        "sex":"Gender",
        "man":"Male",
        "women":"Female",
        "permiss_role":"Permission Role",
        "shcedule":"Default Shift",
        "access_authorization":"Upload to Device",
        "all_device":"All Device",
        "yes":"Yes",
        "no":"No",
        "upload":"Upload",
        "import_tip1":"Tips: Put photos in the folder to upload, and photo name is the same as user ID, eg:  user ID is 1001, photo name is 1001.",
        "import_tip2":"Place excel form here",
        "import_tip3":"Uploading file must be less than 1MB",
        "upload_file":"Upload Folder",
        "upload_file_num":"Uploading Folder Numbers",
        "img_tip":"Width&Height must be >750pixel & size <2MB",
        "know":"Get it",
        "batchDevice":"Batch Set Employee to Upload to Device",
        "batchCompany":"Batch Set Company&Department",
        "batchDeviceTip":"Select User",
        "batchCompanyTip":"Select Company& Department"
    },
    "attendance":{
        "add_shift":"Add Shift",
        "view":"View ",
        "time_period":"Name of Time Period",
        "time_period_setting":"Setting For Time Period",
        "add_time_period":"Add Time Period",
        "delete_time_period":"Delete Time Period",
        "check_start_time":"Start Check-In Time",
        "work_time":"On-Duty",
        "off_work_time":"Off-Duty",
        "check_out_time":"End Check-Out Time",
        "need_clock_on":"Require Check-In",
        "need_clock_off":"Require Check-Out",
        "late_log":"Count Late",
        "leave_early_log":"Count Early-Leave",
        "attendance_setting":"Attendance Setting",
        "late_minute":"Allowed Late Time：",
        "leave_early_minute":"Allowed Early-Leave Time：",
        "min":"Minutes",
        "week_setting":"Weekend Setting",
        "am":"Morning",
        "pm":"Afternoon",
        "sun":"Sunday",
        "mon":"Monday",
        "tue":"Tuesday",
        "wed":"Wednesday",
        "thur":"Thursday",
        "fir":"Friday",
        "sat":"Saturday",
        "search_worker_name":"Enter User ID to Search",
        "overtime_setting":"Overtime Schedule",
        "overtime_time":"Overtime Time",
        "barch_shift":"Shift Schedule",
        "plan_worktime":"Planned WorkTime"
    },
    "temperature":{
        "temperature_setting":"Body Temperature Setting",
        "normal_setting":"Normal Body Temperature Setting"
    },
    "validation":{
        "format":"Incorrect Format",
        "device_id":"Device ID",
        "device_name":"Device Name",
        "open_door_continue_time":"Door-Opening Time",
        "camera_detect_type":"Live Detection",
        "open_door_type":"Verify Mode",
        "server_ip":"Server IP Address",
        "subnet_ip":"Subnet mask ",
        "gateway":"Gateway",
        "dns":"Primary DNS",
        "dns_alter":"Backup DNS",
        "port":"Server Port",
        "company":"Select Company",
        "company1":"Company Name",
        "department1":"Select Department",
        "department":"Department Name",
        "shift_name":"Shift Name",
        "holiday_name":"Holiday Name",
        "select_data":"Select Date",
        "remark":"Remark",
        "overtime":"Select Time Period",
        "overtime_period_name":"Name of Time Period",
        "language":"Language Name",
        "language_config":"Language Setting",
        "normal_temp":"Normal Body Temperature Range",
        "low_temp":"High Temperature to Alarm",
        "worker_name":"User Name",
        "worker_id":"User ID",
        "employee_card":"Enter Card No.",
        "is_encrypt":"Encrypted or not?",
        "sex":"Gender",
        "role":"Select Permission Role",
        "departure":"Resigned?",
        "access_authorization":"Upload to Device",
        "shcedule":"Select Shift",
        "img_tip1":"Photo format must be JPG/PNG !",
        "img_tip2":"Photo size must be less than 2MB!",
        "img_tip3":"Resolution of Height&Width must be more than 750pixel",
        "img_tip4":"Must uploading face photo here",
        "status":"Please select status",
        "authority":"Select Permission",
        "nickname":"Mandatory Field",
        "phone":"Mandatory Field",
        "password":"Mandatory Field",
        "password1":"Must be more than 8 letters",
        "username":"Duplicated User Name",
        "role_id":"Mandatory Field",
        "v_worker_id":"Duplicated User ID",
        "v_employee_card":"Duplicated Card No.",
        "v_device_name":"Must be less than 17 letter",
        "device_defend_time":"Auto-Reboot Time"
    }
}`
      },
      rules: {
        language: [
          {
            required: true,
            message: this.$t('validation.language'),
            trigger: 'blur'
          }
        ],
        json: [
          {
            required: true,
            message: this.$t('validation.language_config'),
            trigger: 'blur'
          }
        ]
      }
    }
  },
  methods: {
    openAdd() {
      this.dialogTableVisible = true
    },
    submitForm() {
      this.$refs.formData.validate((valid) => {
        if (!valid) {
          return
        } else {
          // 添加
          addInfo(store.getters.token, this.formData).then((res) => {
            if (res.data.status) {
              this.$message.success(this.$t('table.add_complete'))
              this.$emit('getList')
              this.closeDia()
            } else {
              this.$message.error(this.$t('table.add_fail'))
            }
          })
        }
      })
    },
    // 关闭弹窗
    closeDia() {
      this.formData = {
        name: null,
        begin_time: null,
        end_time: null,
        desc: null
      }
      this.dialogTableVisible = false
    }
  }
}
</script>

<style scoped>
</style>
